
<template>
  <div class="utils-tools-wrap">
    <div class="left-wrap"
         v-if="needLeft">
      <div v-for="btn in btnList"
           :key="btn.cb"
           class="btnList">
        <a-button v-if="btn.name !== '导入'"
                  @click="handleActive(btn)">{{ btn.name }}</a-button>
        <div v-else>
          <a-upload name="file"
                    :multiple="false"
                    :action="url"
                    :headers="headers"
                    :showUploadList="false"
                    :beforeUpload="handlerBeforeUpload"
                    @change="handleChange">
            <a-button>{{ btn.name }}</a-button>
          </a-upload>
        </div>

      </div>
      <!-- <a-button
        v-for="btn in btnList"
        :key="btn.cb"
        @click="handleActive(btn)"
        >{{ btn.name }}</a-button
      > -->
    </div>
    <div class="right-wrap"
         v-if="needRight">
      企业容量<span class="tx">10</span>,已添加<span class="tx">{{
        dataValue[0]
      }}</span>
      ,专利总量<span class="tx">{{ dataValue[1] }}</span>件
    </div>
  </div>
</template>

<script>
import { getStorage } from '@/utils/index'

export default {
  props: {
    needLeft: Boolean, // 显示左侧工具栏
    needRight: Boolean, // 显示右侧工具栏
    btnList: Array, // 左侧操作按钮的列表
    value: Array,
    dataValue: Array,
    url: String,
  },
  data() {
    return {
      headers: {},
      uploadTypeMap:
        'xlsx,xlsx', // 请求的限制条件
    }
  },
  mounted() {
    const token = `${getStorage('token', 0)}`
    this.headers = {
      Authorization: token,
    }
  },
  methods: {
    handlerBeforeUpload(file) {
      const { name } = file
      const type = name.split('.').slice(-1)
      if (this.uploadTypeMap.indexOf(type) === -1) {
        this.$apiStatusHandler(99, '上传的附件类型不符合要求')
        return Promise.reject()
      }
    },
    handleActive(item) {
      const { cb } = item
      this.$emit('utilsClick', { cb })
    },
    handleChange(e) {
      // console.log(e);
      if (e.file.status !== 'removed') {
        this.$emit('importChange', e)
      }
    },
  },
}
</script>
